<include file="App/Home/View/default/Public/header.html"/>
  <link href="__PUBLIC__/css/show_detail.css" rel="stylesheet" media="screen">
	<div id="content">
        <div class="container">
          <div class="row">
            <div class="col-md-9">
              <div class="food">
               <div class="food-info clearfix">
                 <div class="food-publisher">
                     <a class="publisher-avatar" href="#" _hover-ignore="1" _orighref="#" _tkworked="true">
                         <img src="__PUBLIC__/images/default_avatar.jpg" alt="哇礼小编">
                     </a>
                     <div class="publisher-info">
                         <span>由<a href="#">哇礼小编</a>发布</span>
                     </div>
                     <ul class="publisher-actions">
                     </ul>
                 </div>
                 <div class="food-detail clearfix J_GoodsWrap">
                   <div class="commodity-images-mod">
                       <div class="large-image-box">
                          <a class="J_PurchaseBtn" href="" target="_blank" title="{$goods_info.title}" >
                               <img class="img-responsive J_GoodsPic" src="__PUBLIC__/Uploads/{$goods_img[0]['cover']}" width="298" height="298" alt="{$goods_info.title}" itemprop="image">
                          </a>
                           <i id="J_BtnImageGallery" class="fa fa-search-plus icon-view-large-images" title="点击浏览大图" style="display: inline;"></i>
                       </div>
                       <ul class="nav-images">
                          <foreach name="goods_img" item="vo">
                            <li class="nav-image <?php if($key==0) echo 'active';?>">
                               <img src="__PUBLIC__/Uploads/{$vo.thumb}" width="40" height="40" alt="{$goods_info.title}" data-large-url="__PUBLIC__/Uploads/{$vo.cover}">
                           </li>
                          </foreach>                 
                       </ul>
                   </div>
                   <h1 class="commodity-name" itemprop="name">
                      <a class="J_PurchaseBtn" href="#">{$goods_info.title}</a>
                   </h1>
                   <div class="commodity-purchase-mod">
                       <span class="commodity-price " itemprop="price">
                           ￥{$goods_info.cost_price}&nbsp;|&nbsp;{$platform[$goods_info['source']]}
                       </span>                    
                    <span class="btn-buy-mask">
                      <a class="J_PurchaseBtn btn-buy" >
                          去购买
                      </a>
                    </span>
                   </div>
                   <div class="commodity-quote">
                         <q class="js-expand-quote quote">{$goods_info.why_recommend|default='Ta很懒，还没有填写推荐语'}</q>
                    </div>
                    <div class="commodity-actions" data-id="{$goods_info.id}">
                      <div class="btn-like-wrap">
                        <a class="J_CommodityLikeBtn btn-like active" href="javascript:void(0)">
                            <span class="main">喜欢<em class="count">{$goods_info.like_count}</em></span>
                            <span class="unactive-tips" data-tips="不喜欢?">不喜欢?</span>
                        </a>
                      </div>
                      <a class="J_AddToDrawer btn-doulist" href="#add_drawer" data-toggle="modal">
                          加入抽屉
                          <em class="count">{$goods_info.add2drawer_count}</em>
                      </a>
                      <div class="share-to pull-right clearfix">
                        <span>分享到</span>
                        <ul>
                          <li><a href="javascript:;" class="share-item weixin"></a></li>
                          <li><a href="javascript:;" class="share-item weibo"></a></li>
                          <li><a href="javascript:;" class="share-item q-zone"></a></li>
                          <li><a href="javascript:;" class="share-item qq"></a></li>
                        </ul>
                      </div>
                    </div>
                 </div>
                 <div class="food-response">
                   <div class="tab">
                     <ul class="nav nav-tabs">
                       <li class="active">
                         <a href="#comment" data-toggle="tab">回应</a>
                       </li>
                       <li>
                         <a href="#recommend" data-toggle="tab">推荐</a>
                       </li>
                       <li>
                         <a href="#wish" data-toggle="tab">想要</a>
                       </li>
                       <li>
                         <a href="#prize" data-toggle="tab">赞赏</a>
                       </li>
                     </ul>
                     <div class="tab-content">
                       <div class="tab-pane active" id="comment">
                         <ul class="comment-list">
                         <foreach name="comment_list" item="vo">
                           <li class="comment-item" data-id="{$vo.id}">
                             <div class="pic">
                               <a href="javascript:;"><img src="__PUBLIC__/Uploads/{$vo.avatar|default="default_avatar.jpg"}" alt="{$vo.user_name}" width="48" height="48"></a>
                             </div>
                             <div class="comment-content">
                              <if condition="$vo['reply_id'] neq 0">
                               <div class="reply-quote">
                                   <span class="short">{$vo.reply_content}</span>
                                   <span class="all">{$vo.reply_content}</span>
                                   <span class="pubdate"><a href="javascript:;">{$vo.reply_user_name}</a></span>
                               </div>
                               </if>
                               <p class="comment-txt">
                                 {$vo.comment}
                               </p>
                               <div class="author">
                                 <span>{$vo.time_past}</span>
                                 <a href="">{$vo.user_name}</a>
                               </div>
                               <if condition="$user_id neq $vo['uid']">
                               <div class="op-links">
                                 <a href="javascript:;" class="want_u J_Up" alt="哇！神评论" title="哇！神评论"><i class="fa fa-thumbs-up"></i>(<span class="J_UpCount">{$vo.up_count}</span>)</a>
                                 <span class="sep">|</span>
                                 <a href="javascript:;" class="link-reply J_Reply">回应</a>
                                 <if condition="$is_login eq 1">
                                 <span class="sep">|</span>
                                 <a rel="nofollow" href="javascript:;" class="report-abuse J_Report">举报</a>
                                 </if>
                               </div>
                               </if>
                             </div>
                           </li>
                           </foreach>
                         </ul>
                        <if condition="$is_login eq 1">
                         <div class="postitem-content comment-form">
                           <form class="food-comment story-postform active J_Comment" action="add_comment" name="comment_form" method="post" data-goods-id="{$goods_info.id}">
                              <span class="postitem-avatar">
                                  <img src="__PUBLIC__/Uploads/{$user_info.avatar|default="default_avatar.jpg"}" alt="{$user_info.user_name}">
                              </span>
                              <input type="hidden" name="goods_id" value="{$goods_info.id}">
                              <input type="hidden" name="ref_id" value="">
                              <input type="hidden" name="ref_kind" value="">
                              <div class="postitem-refer hidden">
                                  <span class="refer-text"></span>
                                  <a class="refer-author">用户名</a>
                                  <a class="refer-close J_CloseQuote" href="javascript:;">×</a>
                              </div>

                             <div class="item">
                                 <textarea name="rv_comment" rows="4" class="form-control J_Review" placeholder="礼物好不好，说说你的看法...."></textarea>
                             </div>
                             <div class="comment-actions">
                                 <button class="btn btn-default btn-submit btn-add-post" type="submit">发布</button>
                                <!--  <label class="share-label">
                                     <input type="checkbox" name="sync_to_mb">推荐到广播
                                 </label> -->
                             </div>
                           </form>
                           <!-- <div class="tips-common">
                             <div class="tips-hd">提示：</div>
                             <div class="tips-bd">
                               <div class="tips-content">
                                 回应也可以@友邻了
                               </div>
                               <a href="#" class="lnk-bn lnk-close">知道了</a>
                             </div>
                           </div> -->
                         </div>
                        </if>
                       </div>
                       <div class="tab-pane" id="recommend">
                         <ul>
                           <li>
                             <div class="pic">
                               <a href="javascript:;">
                                 <img src="__PUBLIC__/images/default_avatar.jpg" alt="" width="24px" height="24px">
                               </a>
                             </div>
                             <div class="respond-content">
                               <a href="javascript:;">Morily_sunliet</a>
                                推荐了这件礼物
                                <span class="pubtime">2015-10-02 15:52:15</span>
                             </div>
                           </li>
                           <li>
                             <div class="pic">
                               <a href="javascript:;">
                                 <img src="__PUBLIC__/images/default_avatar.jpg" alt="" width="24px" height="24px">
                               </a>
                             </div>
                             <div class="respond-content">
                               <a href="javascript:;">Morily_sunliet</a>
                                推荐了这件礼物
                                <span class="pubtime">2015-10-02 15:52:15</span>
                             </div>
                           </li>
                         </ul>
                       </div>
                       <div class="tab-pane" id="wish">
                         <ul>
                           <li>
                             <div class="pic">
                               <a href="javascript:;">
                                 <img src="__PUBLIC__/images/default_avatar.jpg" alt="" width="24px" height="24px">
                               </a>
                             </div>
                             <div class="respond-content">
                               <a href="javascript:;">Morily_sunliet</a> 想要这种礼物
                                <span class="pubtime">2015-10-02 15:52:15</span>
                             </div>
                           </li>
                           <li>
                             <div class="pic">
                               <a href="javascript:;">
                                 <img src="__PUBLIC__/images/default_avatar.jpg" alt="" width="24px" height="24px">
                               </a>
                             </div>
                             <div class="respond-content">
                               <a href="javascript:;">Morily_sunliet</a> 想要这种礼物
                                <span class="pubtime">2015-10-02 15:52:15</span>
                             </div>
                           </li>
                         </ul>
                       </div>
                       <div class="tab-pane" id="prize">
                         <ul>
                           <li>
                             <div class="pic">
                               <a href="javascript:;">
                                 <img src="__PUBLIC__/images/default_avatar.jpg" alt="" width="24px" height="24px">
                               </a>
                             </div>
                             <div class="respond-content">
                               <a href="javascript:;">Morily_sunliet</a>
                                赞赏了这件礼物5积分
                                <span class="pubtime">2015-10-02 15:52:15</span>
                             </div>
                           </li>
                           <li>
                             <div class="pic">
                               <a href="javascript:;">
                                 <img src="__PUBLIC__/images/default_avatar.jpg" alt="" width="24px" height="24px">
                               </a>
                             </div>
                             <div class="respond-content">
                               <a href="javascript:;">Morily_sunliet</a>
                                赞赏了这件礼物5积分
                                <span class="pubtime">2015-10-02 15:52:15</span>
                             </div>
                           </li>
                         </ul>
                       </div>
                     </div>
                   </div>
                 </div>
               </div> 
              </div>
            </div>
            <div class="col-md-3">
              <div class="aside">
                <div class="drawer-list-intro">
                  <div class="hd">
                      <span class="belonging">所属抽屉：</span>
                      <h2>
                        <a href="{:U('drawer/'.set_drawer_id($goods_info['drawer_id']))}" title="{$drawer_info.title}">{$drawer_info.title}</a>
                      </h2>
                  </div>
                  <div class="bd load-more with-scrollbar">
                    <ul class="doulist-story-list">
                      <foreach name="drawer_goods_list" item="vo">
                        <li class="doulist-story-item">
                            <a href="{:U('goods/'.$vo['id'])}">
                                <img src="__PUBLIC__/Uploads/{$vo.cover|default="drawer_default.jpg"}" width="64" height="64" alt="{$vo.title}">
                            </a>
                        </li>
                      </foreach>                     
                    </ul>
                  </div>
                  <div class="ft load-more">
                    <if condition="$goods_info['post_uid'] neq $user_id">
                      <div class="actions">
                        <span data-drawer-id="{$drawer_info.id}" class="btn-sub-doulist J_SubscribeDoulist <if condition="$is_followed eq true">followed</if>" data-source="2" data-text="关注抽屉" data-subscribed-text="已关注"><i class="fa <if condition="$is_followed eq true">fa-star<else/>fa-star-o</if>"></i><i class="J_ActionNotice"><if condition="$is_followed eq true">已关注<else/>关注抽屉</if></i></span>
                      </div>
                    </if>
                  </div>
                </div>

                <!--app download begin-->
                <div class="aside-download-app">
                    <div class="download-app-qrcode">
                        <div class="qrcode-image">
                            <img src="__PUBLIC__/images/qr_code.jpg" alt="扫描二维码下载好礼APP" width="96" height="96">
                        </div>
                        <div class="qrcode-info">
                            <span class="title">浏览哇礼手机版</span>
                            <span>手机扫描二维码</span>
                            <span>把好礼装进口袋</span>
                        </div>
                    </div>
                    <div class="download-app-links">
                        <a class="app-iphone" href="javascript:;"><i class="fa fa-apple fa-2"></i>iPhone 版</a>
                        <a class="app-android" href="javascript:;"><i class="fa fa-android fa-2"></i>Android 版</a>
                    </div>
                </div>
                <div class="aside-follow-us">
                    <h2>关注我们</h2>
                    <ul>
                        <li>微信:&nbsp;<a target="_blank" href="javascript:;">哇食</a></li>
                        <li>微博:&nbsp;<a target="_blank" href="javascript:;">@哇食</a></li>
                    </ul>
                </div>
                <div class="mod feedback">
                    <a href="javascript:void(0)" class="J_ReportButton">举报好礼</a>
                    <p><a target="_blank" href="javascript:;">我要提意见</a></p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <script type="text/javascript">
        var drawerFollow = '{:U('Drawer/follow')}',
            reviewUrl    = '{:U('Goods/add_comment')}',
            approveUrl   = '{:U('Goods/approve')}',
            reportUrl    = '{:U('Goods/report')}';

        $(function() {
          $('.comment-item').hover(function() {
            $(this).find('.op-links').css('visibility', 'visible');
          }, function() {
            $(this).find('.op-links').css('visibility', 'hidden');;
          });

          //评论点赞和举报
          $('.comment-item').on('click', '.J_Up', approve);
          function approve() {
            if ($(this).hasClass('disabled')) { return false; };
            if (!isLogin) { return false; };
            var $this = $(this);
            var commentId = $(this).closest('li').attr('data-id');
            if (!commentId) { return false; };

            $.post(approveUrl, { comment_id:commentId }, function(data) {
              if (data.status != 'succ') {
                alert(data.msg);
              } else {
                var oldNum = parseInt($this.find('.J_UpCount').text());
                $this.addClass('disabled');
                $this.find('.J_UpCount').text((oldNum+1));
              }
            }, 'json');
          };

          $('.comment-item').on('click', '.J_Report', report);
          function report() {
            if ($(this).hasClass('disabled')) { return false; };
            if (!isLogin) { return false; };
            var $this = $(this);
            var commentId = $(this).closest('li').attr('data-id');
            if (!commentId) { return false; };

            $.post(reportUrl, { comment_id:commentId }, function(data) {
              if (data.status != 'succ') {
                alert(data.msg);
              } else {
                $this.addClass('disabled');
                $this.text('举报成功');
              }
            }, 'json');
          }

          //点击商品缩略图效果
          $('.nav-images').on('click', 'li', showImg);
          function showImg() {
            if ($(this).hasClass('active')) { return false; };
            $(this).addClass('active').siblings().removeClass('active');
            var largePic = $(this).find('img').attr('data-large-url');
            $('.large-image-box .J_GoodsPic').attr('src', largePic);
          }

          ///////////////////发布评论效果开始/////////////////
          $('.J_Comment').bind('submit', function() {
            var goodsId = $(this).attr('data-goods-id');
            var replyId = $('input[name="ref_id"]').val();
            if (!goodsId) { return false; };

            var review = $.trim($('.J_Review').val());
            if (!review) { alert('评论内容不能为空'); return false; };

            var data = { goods_id:goodsId, comment: review, reply_id:replyId };
            $.post(reviewUrl, data, function(data) {
              if(data.status == 'succ') {
                //将评论内容添加到网页中
                renderOne();
              } else {
                alert(data.msg);
              }
            }, 'json');
            return false;
          });

          //添加评论
          function renderOne() {
            var replyId        = $('input[name="ref_id"]').val();
            var avatarObj      = $('.J_Comment .postitem-avatar img');
            var postUserAvatar = avatarObj.attr('src');
            var postUserName   = avatarObj.attr('alt');
            var review         = $('.J_Review').val();
            var replyToPost    = $('.comment-list li[data-id="'+replyId+'"]');

            var replyQuote = '';
            if (replyToPost.length) {
              var replyUser       = replyToPost.find('.pic a img'),
                  replyUserName   = replyUser.attr('alt'),
                  replytoComment  = replyToPost.find('.comment-txt').text();

                  replyQuote      = String()
                                    + '<div class="reply-quote">'
                                      + '<span class="short">'+replytoComment +'</span>'
                                      + '<span class="all">'+ replytoComment +'</span>'
                                      + '<span class="pubdate"><a href="javascript:;">'+replyUserName+'</a></span>'
                                    + '</div>';
            };

            var comment = String()
                          + '<li class="comment-item" data-id="">'
                            + '<div class="pic">'
                              + '<a href="javascript:;"><img src="'+postUserAvatar+'" alt="'+ postUserName +'" width="48" height="48"></a>'
                            + '</div>'
                            + '<div class="comment-content">'
                              + replyQuote
                              + '<p class="comment-txt">'+ review +'</p>'
                              + '<div class="author">'
                                + '<span>刚刚</span>'
                                + '<a href="javascript:;">'+postUserName+'</a>'
                              + '</div>'
                              + '<div class="op-links">'
                                + '<a href="javascript:;" class="link-reply J_Reply" rel="nofollow">回应</a>'
                                + '<a rel="nofollow" href="javascript:;" class="report-abuse">举报</a>'
                              + '</div>'
                            + '</div>'
                          + '</li>';
                $('.comment-list').append(comment);
                renderEnd();
                clearQuote();
          };

          //将评论添加到DOM之后的操作
          function renderEnd() {
            $('.J_Review').val('');            
          }

          $('.J_CloseQuote').bind('click', clearQuote);
          //清空之前的引用内容
          function clearQuote() {
            $('.postitem-refer').addClass('hidden');
            $('input[name="ref_id"]').val('');
            $('.postitem-refer .refer-text').text('');
            $('.postitem-refer .refer-author').text('');
          };

          //当点击回应的时候展开引用内容
          function showQuote() {
            var parentLi     = $(this).closest('li');
            var replyId      = parentLi.attr('data-id');
            var replyComment = parentLi.find('.comment-txt').text(),
                replyUser    = parentLi.find('.author a').text();

            $('.postitem-refer').removeClass('hidden');
            $('input[name="ref_id"]').val(replyId);
            $('.postitem-refer .refer-text').text(replyComment);
            $('.postitem-refer .refer-author').text(replyUser);
            $('.J_Review').focus();
          }

          $('.comment-list').on('click', '.J_Reply', showQuote);
          ///////////////////发布评论效果结束/////////////////

          //关注抽屉效果
          $('.J_SubscribeDoulist').click(function() {
            if (!isLogin) {
              $('.login').trigger('click');
              return false;
            };

            $(this).toggleClass('followed');
            if ($(this).hasClass('followed')) {
              $(this).find('.fa').removeClass('fa-star-o')
                                 .addClass('fa-star');

              $(this).find('.J_ActionNotice')
                     .text($(this).attr('data-subscribed-text'));
            } else {
              $(this).find('.fa').removeClass('fa-star')
                                 .addClass('fa-star-o');
              $(this).find('.J_ActionNotice')
                     .text($(this).attr('data-text'));
            }

            var drawerId = $(this).attr('data-drawer-id');
            //避免重复请求
            if (!drawerId || $(this).hasClass('disabled')) {
              return false;
            };

            $(this).addClass('disabled');
            $.post(drawerFollow, { drawer_id: drawerId }, function(data) {
              $('.J_SubscribeDoulist').removeClass('disabled');
            }, 'json');
          });
        });

      </script>
<include file="App/Home/View/default/Public/footer.html"/>